<template>
  <div class="p-4">
    <Card v-bind="$attrs">
      <BasicForm @register="registerForm" @submit="handleSubmit" />
    </Card>
  </div>
</template>

<script lang="ts" setup>
  import { onMounted } from "vue";
  import { Card } from "ant-design-vue";
  import { useForm } from "/@/components/Form";
  import { useMessage } from "/@/hooks/web/useMessage";
  import BasicForm from "/@/components/Form/src/BasicForm.vue";
  import { defaultFormSettings } from "/@/hooks/core/useDefault";
  import { formSchema } from "/@/views/student/practical/info/data";
  import { getInfoApi, saveOrUpdateInternInfoApi } from "/@/api/core/internInfo";

  const [registerForm, { setFieldsValue, setProps }] = useForm({
    labelWidth: 120,
    schemas: formSchema,
    ...defaultFormSettings,
  });

  const { createMessage } = useMessage();

  async function handleSubmit(value) {
    try {
      await setProps({
        submitButtonOptions: {
          loading: true,
        },
      });
      await saveOrUpdateInternInfoApi(value);
      createMessage.success("实习信息提交成功");
    } finally {
      await setProps({
        submitButtonOptions: {
          loading: false,
        },
      });
    }
  }

  onMounted(async () => {
    await setFieldsValue({ ...(await getInfoApi()) });
  });
</script>
